.tooltip, .preview, .screenshot {
	cursor: pointer;
	position: relative;
	float: left;
	height: 13px;
}
#tooltip { width: 150px; }

#tooltip, #preview {
	color: #28313F;
	background: #CADCEB;
	border: 1px solid #333333;
	padding: 5px;
	opacity: 0.9;
	filter: alpha(opacity=90);
	text-align: left;
	border-radius: 1em;
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	display: none;
}

/* overall box style */
#recruitTalent {width: 100%; }


/* opacity used on images */
div.high { opacity: 1; filter: alpha(opacity=100); }
div.medium { opacity: .75; filter: alpha(opacity=75); }
div.low { opacity: .5; filter: alpha(opacity=50); }
div.none { opacity: .25; filter: alpha(opacity=25); }

/* ".clico" contains the icon and text, ".clico span" only contains the class name text */
.clico { width: 60%; background: url(../recruitjs/sprites.gif) no-repeat top left; width: 18px; height: 18px;}
.clico span { padding-left: 20px; }

/*  contains all 3 talent tree icons */
.talicos { width: 40%; text-align: right; }
.talico{ background: url(../recruitjs/sprites.gif) no-repeat top left; width: 18px; height: 18px;}

/* talent and class sprites */
/*class icons */
.icoc_1{ background-position: 0 0;  } 
.icoc_2{ background-position: 0 -23px;  } 
.icoc_3{ background-position: 0 -46px;  } 
.icoc_4{ background-position: 0 -69px;  } 
.icoc_5{ background-position: 0 -92px;  } 
.icoc_6{ background-position: 0 -115px;  } 
.icoc_7{ background-position: 0 -138px;  } 
.icoc_8{ background-position: 0 -161px;  } 
.icoc_9{ background-position: 0 -184px;  } 
.icoc_10{ background-position: 0 -207px;  }
 
 /* talent icons */
.idk_1{ background-position: 0 -230px;  } 
.idk_2{ background-position: 0 -253px;  } 
.idk_3{ background-position: 0 -276px;  } 
.idru_1{ background-position: 0 -299px;  } 
.idru_2{ background-position: 0 -322px;  } 
.idru_3{ background-position: 0 -345px;  } 
.ihunt_1{ background-position: 0 -368px;  } 
.ihunt_2{ background-position: 0 -391px;  } 
.ihunt_3{ background-position: 0 -414px;  } 
.imag_1{ background-position: 0 -437px;  } 
.imag_2{ background-position: 0 -460px;  } 
.imag_3{ background-position: 0 -483px;  } 
.ipala_1{ background-position: 0 -506px;  } 
.ipala_2{ background-position: 0 -529px;  } 
.ipala_3{ background-position: 0 -552px;  } 
.ipre_1{ background-position: 0 -575px;  } 
.ipre_2{ background-position: 0 -598px;  } 
.ipre_3{ background-position: 0 -621px;  } 
.irog_1{ background-position: 0 -644px;  } 
.irog_2{ background-position: 0 -667px;  } 
.irog_3{ background-position: 0 -690px;  } 
.isham_1{ background-position: 0 -713px;  } 
.isham_2{ background-position: 0 -736px;  } 
.isham_3{ background-position: 0 -759px;  } 
.ilock_1{ background-position: 0 -782px;  } 
.ilock_2{ background-position: 0 -805px;  } 
.ilock_3{ background-position: 0 -828px;  } 
.iwar_1{ background-position: 0 -851px;  } 
.iwar_2{ background-position: 0 -874px;  } 
.iwar_3{ background-position: 0 -897px;  } 



/* class colors */
span.cor_1{ color:#c41f3b; }
span.cor_2{ color:#ff7d0a; }
span.cor_3 { color:#abd473; }
span.cor_4 { color:#69ccf0; }
span.cor_5 { color:#f58cba; }
span.cor_6 { color:#ffffff; }
span.cor_7 { color:#fff569; }
span.cor_8 { color:#2459ff; }
span.cor_9 { color:#9482c9; }
span.cor_10 { color:#c79c6e; }
